import React from 'react';
import { toJS } from 'mobx';
import { inject, observer } from 'mobx-react';
import { withRouter } from 'react-router-dom';
import { Tools, Tabs } from 'weaver-mobile';
import { ListViewPage } from 'weaver-mobile-page';
import MyShare from './MyShare';
const getLabel = Tools.getLabel;

@inject('userCenterStore')
@withRouter
@observer
export default class Share extends React.Component {
  static defaultProps = {
    prefixCls: 'blog-center-setting-share'
  }

  componentDidMount () {
    const { userCenterStore: { settingStore } } = this.props;
    settingStore.getDefaultShareList();
  }

  renderRow = (rowData, sectionID, rowID) => {

  }
  getTemplate = () => {
    const { prefixCls } = this.props;
    const newTemp = {
      default: [{
        key: 'col_1',
        render: (data) => {
          const { canViewMinTime, typespan, shareType2span } = data;
          
          return (
            <div className={`${prefixCls}-default-line`}>
              <div className={`${prefixCls}-default-line-title`}>{typespan}</div>
              
            </div>
          )
        }
      }]
    }
    return newTemp;
  }

  render() {
    const { prefixCls, userCenterStore: { settingStore } } = this.props;
    const { sharePage, setState, defaultList } = settingStore;
    const tabs = [
      {title: getLabel(381919,'默认分享')},
      {title: getLabel(33310,'我的分享')},
    ]
    console.log('sharePage', toJS(defaultList.data));
    
    return (
      <div className={prefixCls}>
        <Tabs 
          tabs={tabs}
          initialPage='0'
          onChange={(tab, index) => { setState({ sharePage: index }) }}
        >
        {/* {
          sharePage === 0 && ( 
            <ListViewPage.Normal 
              store={defaultList}
              renderRow={this.renderRow}
              getTemplate={this.getTemplate}
            />
          )
        } */}
        {/* { sharePage === 1 && <MyShare/> } */}
          <MyShare/>
        </Tabs>
      </div>
    )
  }
}